<template>
    <div>
        <MyNavBar></MyNavBar>
        <div class="container">
            <div class="container-subject">
                <!--版块组件-->
                <MyCatalogBar></MyCatalogBar>
                <!--博文详情容器组件-->
                <MyBlogDetailsContainer></MyBlogDetailsContainer>
            </div>
        </div>
        <br>
        <MyFooter></MyFooter>
    </div>
</template>

<script>
    import MyNavBar from "@/components/pc/MyNavBar";
    import MyCatalogBar from "@/components/pc/MyCatalogBar";
    import MyBlogDetailsContainer from "@/components/pc/MyBlogDetailsContainer";
    import MyFooter from "@/components/pc/MyFooter";
    export default {
        name: "MyBlogDetails",
        components: {
            MyNavBar,
            MyCatalogBar,
            MyBlogDetailsContainer,
            MyFooter
        }
    }
</script>

<style scoped>
    .container {
        width: 100%;
        height: auto;
        background-color: #fafafa;
        padding: 10px 0px 20px 0px;
        margin: 0px 0px 10px 0px;
    }

    .container-subject {
        width: 80%;
        height: auto;
        background-color: #fafafa;
        margin: 0px auto;

    }
</style>